﻿'use strict';

define([
    'commonView',
], function (CommonView) {
    var View = CommonView.extend({
        attributes: {
            'data-editable': false,
        },
        className: 'row worker-panel',
        events: {
            'click': function (event) {
                this.setSelected(true);
            },

            'click .delete': function (event) {
                if (confirm('El empleado "' + this.model.get('lastName') + ' ' + this.model.get('name') + '" será borrado. ¿Continuar?'))
                    this.trigger('deleted', this, this.model.attributes);
            },
            'click .edit': function (event) {
                this.setEditable(true);
            },
            'click .save': function (event) {
                this.save();
                this.setEditable(false);
            },
        },

        //fields: {
        //    workerName: {
        //        el: null,
        //    },
        //    workerName_: {
        //        el: null,
        //    },
        //    workerLastName_
        //        workerTel_
        //    workerEmail_
        //workerAddress_
        //workerAddressNumber_
        //workerDept_
        //workerLocality_
        //workerCity_
        //},

        getData: function () {
            var data = {},
                fn_each = function (index, item) {
                    var $item = $(item),
                        fieldData;

                    fieldData = $item.data();

                    switch (fieldData['fieldType'])
                    {
                        case 'textbox':
                            data[fieldData.name] = $item.val();
                        default:
                            break;
                    }
                };

            this.$el
                .find('[data-field="true"]')
                .each(fn_each);

            return data;
        },
        save: function () {
            this.model.set(this.getData());

            this.trigger('edited', this, this.model.attributes)
        },
        setEditable: function (editable, options) {
            if (this.model.get('editable') != editable) {
                this.model.set('editable', editable, options);

                this.$el
                    .attr('data-editable', editable)
                    .find('input')
                    .prop('readonly', !editable);
            }

            return this;
        },
        setSelected: function (selected, options) {
            if (this.model.get('selected') != selected) {
                this.model.set('selected', selected, options);

                if (selected)
                    this.$el.addClass('ui-selected');
                else
                    this.$el.removeClass('ui-selected');

                $('html, body').animate({
                    scrollTop: this.$el.offset().top - 65, /* Add a fix value to rest the height of the navbar. */
                    delay: 1, /* Use a delay to let screen refresh body size to prevent issues on manual scroll. */
                }, 500);
            }

            return this;
        },
    });

    return View;
});